<template>
  <div style="background-color: rgb(255, 255, 255);position: fixed;width: 100%;z-index: 99999;">
    <el-row>
      <el-col :span="13">
        <div class="grid-content bg-purple">
          <img
            src="../assets/logo-colo.png"
            style="margin-left: 120px; margin-top: 10px"
          />
        </div>
      </el-col>
      <el-col :span="10">
        <el-menu
          :default-active="activeIndex"
          class="el-menu-demo"
          mode="horizontal"
          @select="handleSelect"
          text-color="black"
          active-text-color=" rgb(37, 24, 217)"
        >
          <el-menu-item index="home">首页</el-menu-item>
          <el-menu-item index="zhandian" style="margin-left: 30px"
            >旗下站点</el-menu-item
          >
          <el-menu-item index="zanzhu" style="margin-left: 25px"
            >赞助商</el-menu-item
          >
          <el-menu-item index="guanyu" style="margin-left: 25px"
            >关于我们</el-menu-item
          >
          <el-button
            v-if="user === ''"
            type="primary"
            size="small"
            style="margin-top: 14px; margin-left: 50px"
            @click="login()"
            >快速登录</el-button
          >
          <div>
            <el-dropdown v-if="user!==''" style="margin-top: 20px; margin-left: 50px" @command="handleCommand">
              <span class="el-dropdown-link">
                {{ user.name }}<i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item command="a">退出</el-dropdown-item>
                <el-dropdown-item divided command="b">个人信息</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>
        </el-menu>
      </el-col>
      <div class="line"></div>
    </el-row>

    <div style="background-color: rgb(37, 24, 217)"></div>
  </div>
</template>

<script>
import Cookies from "js-cookie";
export default {
  name: "headers",
  data() {
    return {
      activeIndex: "1",
      activeIndex2: "1",
      user: "",
    };
  },
  created() {
    var user = Cookies.get("user");
    if (user === "" || user === null || user === undefined) {
      user = Cookies.get("kefu");
      if (user !== "" && user !== null && user !== undefined) {
        this.user = JSON.parse(user);
      }
     
    } else {
      this.user = JSON.parse(user);
    }
  },
  methods: {
    handleCommand(command) {
       if(command==='a'){
        Cookies.remove("kefu")
        Cookies.remove("user")
        this.user=''
       }
      },
    login() {
      this.$router.push("/login");
    },
    handleSelect(key, keyPath) {
      if (this.$route.name !== key) {
        if (key === "home") {
          this.$router.push("/home");
        } else {
          this.$router.push(key);
        }
      }
    },
  },
};
</script>
<style></style>